<template>
    <div style="margin: 10px">
        <p style="margin-left: 15px">角色列表:</p>

        <Tree :data="roles" show-checkbox @on-check-change="checkChange"></Tree>
    </div>
</template>

<script>
    export default {
        name: "UserRoleView",
        data(){
            return {
                roles: [
                ],
                curUserId:''
            }
        },
        methods:{
            loadDataById(id){
                this.curUserId=id;
                this.$axiosUtils.post("/api/system/role/listByUserId",{userId:id}).then((res)=>{
                    for(let i=0;i<res.length;i++){
                        let node=res[i];
                        node.title=node.name;
                        node.expand=false;
                        if(node.userroleId==null){
                            node.checked=false;
                        }else{
                            node.checked=true;
                        }
                    }
                    this.roles=res;
                });
            },checkChange(data,curData){
                console.log(curData.checked)
                this.$axiosUtils.post("/api/system/userrole/updateById",
                    {
                        id:curData.userroleId,
                        checked:curData.checked,
                        userId:this.curUserId,
                        roleId:curData.id
                    }).then(()=>{

                });
            }
        }
    }
</script>
<style scoped >
</style>
